/* eslint-disable react/jsx-key */
import React, { useState, useMemo, useEffect } from 'react';
import ProDescriptions from '@ant-design/pro-descriptions';
import { Tooltip, Modal, Image } from 'antd';
import { useRequest } from 'ahooks';
import { companydetail } from '@/services/business';
import moment from 'moment';

let valueEnum = {
  cache: {
    text: '暂存',
  },
  stalled: {
    text: '未开始',
  },
  dispatching: {
    text: '会计调度中',
  },
  dispatch_refuse: {
    text: '会计调度拒绝',
  },
  accounting: {
    text: '记账会计审核中',
  },
  account_refuse: {
    text: '记账会计拒绝',
  },
  account_cache: {
    text: '记账会计暂存',
  },
  completed: {
    text: '已完成',
  },
};

export default function CompanyDetail({
  setExpandData=()=>{},
  id,
  col = { xs: 1, sm: 1, md: 2, lg: 3, xl: 4, xxl: 5 },
  only,
}) {
  const columns = [
    {
      title: '公司名称',
      width: 260,
      dataIndex: 'name',
      key: 'name',
    },
    {
      title: '公司法人',
      dataIndex: 'legal_person',
      key: 'legal_person',
      search: false,
      hideInTable: true,
    },
    {
      title: '公司地址',
      dataIndex: 'address',
      key: 'address',
      search: false,
      hideInTable: true,
    },
    {
      title: '统一社会信用代码',
      dataIndex: 'enterprise_credit_code',
      key: 'enterprise_credit_code',
      search: false,
      hideInTable: true,
    },
    {
      title: '公司营业执照',
      dataIndex: 'origin_url',
      key: 'origin_url',
      render: (_, row) => {
        return <Image width={32} height={32} style={{ padding: 2 }} src={row.origin_url} />;
      },
      search: false,
      hideInTable: true,
    },
    {
      title: '联系人',
      dataIndex: 'customer_name',
      key: 'customer_name',
      ellipsis: true,
    },
    {
      title: '联系人手机号',
      width: 120,
      dataIndex: 'customer_phone',
      key: 'customer_phone',
      render: (_, row) => (
        <Tooltip title={row.customer_phone}>
          <a href={`tel:${row.customer_phone}`} className="oneline">
            {row.customer_phone}
          </a>
        </Tooltip>
      ),
    },
    {
      title: '区域名称',
      dataIndex: 'area_name',
      key: 'area_name',
      search: false,
    },
    {
      title: '区域编码',
      dataIndex: 'area_code',
      key: 'area_code',
      search: false,
      hideInTable: true,
    },
    {
      title: '接单人',
      dataIndex: 'user_name',
      key: 'user_name',
      search: false,
      hideInTable: true,
    },
    {
      title: '促单人',
      dataIndex: 'promoter_user_name',
      key: 'promoter_user_name',
      search: false,
      hideInTable: true,
    },
    {
      title: '公司类型',
      dataIndex: 'classify_name',
      key: 'classify_name',
      search: false,
    },
    {
      title: '月收费',
      dataIndex: 'unit_price',
      key: 'unit_price',
      search: false,
    },
    {
      title: '活动',
      dataIndex: 'activity_content',
      key: 'activity_content',
      search: false,
      hideInTable: true,
    },
    {
      title: '合同协议',
      dataIndex: 'contracts',
      key: 'contracts',
      search: false,
      render: (_, row) => {
        if (!row.contracts) {
          return (
            <Image
              width={32}
              height={32}
              style={{ padding: 2 }}
              src={require('@/assets/default.png')}
            />
          );
        } else {
          return row.contracts.map((it) => {
            return <Image width={32} height={32} src={it.origin_url} style={{ padding: 2 }} />;
          });
        }
      },
      hideInTable: true,
    },
    {
      title: '成立日期',
      dataIndex: 'establish_date',
      key: 'establish_date',
      search: false,
      render: (text, row) => {
        return row?.establish_date ? moment(row.establish_date).format('YYYY-MM-DD') : '-';
      },

    },
    {
      title: '签约日期',
      dataIndex: 'sign_date',
      key: 'sign_date',
      search: false,
      render: (text, row) => {
        return row?.sign_date ? moment(row.sign_date).format('YYYY-MM-DD') : '-';
      },
    },
  ];

  const { data, loading } = useRequest(
    async () => {
      if (!id) return;
      let res = await companydetail({ id });
      return res?.data;
    },
    {
      refreshDeps: [id],
      onSuccess: (res) => {
        setExpandData?.(res);
      },
    },
  );

  return id ? (
    <div>
      <ProDescriptions
        title={`公司详细信息`}
        columns={!only ? [...columns] : columns?.filter((it) => only.includes(it.dataIndex))}
        column={col}
        dataSource={data}
      />
    </div>
  ) : (
    <></>
  );
}
